<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <link rel="icon" href="./favicon.ico">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>点击特效</title>
</head>
<style>
    a {
        position: fixed;
        bottom: 100px;
        left: calc(50% - 15px);
        display: flex;
        align-items: center;
        color: white;
    }
    html{
        height: 100vh;
        background-color: black;
    }
    h1{
        text-align: center;
        color: white;
    }
</style>
<body>
    <h1>请点击屏幕查看效果</h1>
    <a class="flex_center" target="_blank" href="https://gitee.com/free_alive/mouseClickAnimation">
        <svg t="1710490657135" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"
            p-id="1729" width="30" height="30">
            <path
                d="M512 512m-494.933333 0a494.933333 494.933333 0 1 0 989.866666 0 494.933333 494.933333 0 1 0-989.866666 0Z"
                fill="#C71D23" p-id="1730"></path>
            <path
                d="M762.538667 457.045333h-281.088a24.4736 24.4736 0 0 0-24.439467 24.405334v61.098666c-0.034133 13.5168 10.922667 24.439467 24.405333 24.439467h171.1104c13.5168 0 24.439467 10.922667 24.439467 24.439467v12.219733a73.3184 73.3184 0 0 1-73.3184 73.3184h-232.209067a24.439467 24.439467 0 0 1-24.439466-24.439467v-232.174933a73.3184 73.3184 0 0 1 73.3184-73.3184h342.152533c13.482667 0 24.405333-10.922667 24.439467-24.439467l0.034133-61.098666a24.405333 24.405333 0 0 0-24.405333-24.439467H420.352a183.296 183.296 0 0 0-183.296 183.296V762.538667c0 13.482667 10.922667 24.439467 24.405333 24.439466h360.516267a164.9664 164.9664 0 0 0 165.000533-165.000533v-140.526933a24.439467 24.439467 0 0 0-24.439466-24.439467z"
                fill="#FFFFFF" p-id="1731"></path>
        </svg>
        <span>gitee</span>
    </a>
    <script src="./mouseClickAnimation.js"></script>
</body>
</html>